<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>031-组件-从data中给组件传值.html</title>
</head>
<body>
	<div id="app">
		<todo-item 
		v-for="(item,index) in items" 
		:task="item.task" 
		:index="index" 
		:key="index">
		
		</todo-item>
	</div>
	<template id="todo-item">
		<div>{{index}}-{{task}}</div>
	</template>
</body>
<script src="js/vue.js"></script>
<script>
	var TodoItem = Vue.extend({
		template:'#todo-item',
		data(){
			return {
			}
		},
		// props:['task']
		props:{
			task:String,
			index:Number
		}
	})
	//注册
	Vue.component('todo-item',TodoItem)

	var vm = new Vue({
		el:'#app',
		data: {
			items:[
			{
				id:1,
				task:'选择'
			},
			{
				id:2,
				task:'这些'
			}
			]
		}
	})
</script>
</html>